import classNames from 'classnames';
import PropTypes from 'prop-types';
import React from 'react';
import { Icon } from '../icon';

export interface IBarProps {
  icon?: string;
  className?: string;
  style?: React.CSSProperties;
  children?: React.ReactNode;
  showGoBackButton?: boolean;
  onGoBack?: () => void;
}

export const Bar: React.SFC<IBarProps> = (props: IBarProps) => (
  <div className={classNames('br-bar', props.className)} style={props.style}>
    {props.children}
    {
      props.showGoBackButton && (
        <div className="br-bar__back" onClick={props.onGoBack}>
          <Icon className="br-bar__back--icon" type="back" />
          返回
        </div>
      )
    }
  </div>
);

Bar.propTypes = {
  icon: PropTypes.string,
  children: PropTypes.node,
  showGoBackButton: PropTypes.bool,
  onGoBack: PropTypes.func,
};
